<!DOCTYPE html>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
	<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
		<html>

		<head>
			<meta charset="utf-8" />
			<meta name="viewport" content="width=device-width, initial-scale=1.0" />

			<!--360浏览器优先以webkit内核解析-->

			<title>H+ 后台主题UI框架 - 主页示例</title>

			<link rel="shortcut icon" href="favicon.ico" />
			<link rel="stylesheet" href="static/js/plugins/layui/css/layui.css">
			<link href="static/css/bootstrap.min.css?v=3.3.7" rel="stylesheet" />
			<link href="static/css/font-awesome.css?v=4.4.0" rel="stylesheet" />
			<link href="static/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
			<link href="static/css/animate.css" rel="stylesheet" />
			<link href="static/css/style.css?v=4.1.0" rel="stylesheet" />
			<style>
				.ibox-title {
					min-height: 15px;
				}

				.ml_20 {
					margin-left: 20px;
				}

				.w100 {
					width: 100px !important;
				}

				.mt-60 {
					margin-top: -60px;
				}
			</style>
		</head>

		<body class="gray-bg">

			<div class="wrapper wrapper-content animated fadeInRight">
				<div class="row">
					<div class="col-sm-12">
						<div class="ibox float-e-margins">
							<div class="ibox-content">
								<form role="form" class="form-inline">
									<div class="form-group">
										<label for="p_name" class="">商品名称:</label>
										<input type="text" id="shop_name" name="shop_name" class="form-control">
									</div>&nbsp;&nbsp;
									<div class="form-group">
										<label for="p_name1" class="">商品类型:</label>
										<input type="text" id="shop_leiixng" name="shop_leiixng" class="form-control">
									</div>
									<button class="btn btn-white" type="button" id="search">查询</button>
								</form>
							</div>
						</div>

					</div>
				</div>
			</div>

			<div class="wrapper wrapper-content animated fadeInRight mt-60">
				<div class="row">
					<div class="col-sm-12">
						<div class="ibox float-e-margins">
							<div class="ibox-content">
								<table class="layui-hide" id="test" lay-filter="test"></table>

							</div>
						</div>
					</div>
				</div>
			</div>

			<script type="text/html" id="barDemo">

				<a class="layui-btn layui-btn-xs layui-btn-danger data-count-delete" lay-event="delete">删除</a>
			</script>
			<script type="text/html" id="toolbarDemo">
				<div class="layui-btn-container">
					<button class="layui-btn layui-btn-normal layui-btn-sm data-add-btn" lay-event="add"> 添加 </button>
				</div>
			</script>

			<script type="text/html" id="tupian">
				<img src="./static/imges/限时抢购.png" alt="">
			</script>
			<!-- 全局js -->
			<script src="static/js/jquery.min.js?v=2.1.4"></script>
			<script src="static/js/bootstrap.min.js?v=3.3.7"></script>
			<script src="static/js/plugins/layer/layer.min.js"></script>
			<script src="static/js/plugins/layui/layui.js"></script>

			<!-- 自定义js -->
			<script src="static/js/content.js"></script>

			<!-- Peity -->
			<script src="static/js/demo/bootstrap-table-demo.js"></script>

			<!-- 欢迎信息 -->
			<script src="static/js/welcome.js"></script>

			<script type="text/html" id="checkboxTpl">
				<input type="checkbox" name="sex"  value="{{d.c_id}}" lay-skin="switch" lay-text="审核未通过|审核通过" lay-filter="sexDemo" {{ d.c_id == '2' ? 'checked' : '' }}>
			</script>
			<script>

				layui.use(['laydate', 'table', 'form'], function () {

					let laydate = layui.laydate;
					let table = layui.table;
					let layer = layui.layer;
					let form = layui.form;

					// laydate.render({
					// 	elem: '#grounding_date'
					// 	//设置开始日期、日期日期的 input 选择器
					// 	//数组格式为 2.6.6 开始新增，之前版本直接配置 true 或任意分割字符即可
					// 	, range: ['#grounding_date_from', '#grounding_date_to']
					// });

					let tableIns = table.render({
						elem: '#test'
						, toolbar: '#toolbarDemo'
						// , url: '/static/json/table/user.json'
						, page: { //支持传入 laypage 组件的所有参数（某些参数除外，如：jump/elem） - 详见文档
							layout: ['limit', 'count', 'prev', 'page', 'next', 'skip'] //自定义分页布局
							//,curr: 5 //设定初始在第 5 页
							, groups: 1 //只显示 1 个连续页码
							, first: false //不显示首页
							, last: false //不显示尾页

						}
						, cols: [[ //标题栏
							{ field: 'c_id', title: 'ID', width: 60 }
							, { field: 'c_name', title: '名称', width: 112, height: 300 }
							, { field: 'c_leicing', title: '类型', width: 112 }
							, { field: 'c_jiage', title: '价格', width: 112 }
							// , { field: 'c_shangpintu', title: '图片', width: 112, templet: '#tupian' }
							, {
								field: 'c_shangpintu', title: '购买人', width: 90, templet: function (res) {
									return '<img src="./static/imges/限时抢购.png" alt="">'
								}
							}

							, { field: 'c_jianjie', title: '介绍', width: 118 }
							, { field: 'c_repertory', title: '库存', width: 112 }
							, { field: 'u_name', title: '卖家账号', width: 112 }
							, { field: 'c_sales_volume', title: '销量', width: 112 }
							, { field: 'accStatus', title: '商品审核', templet: '#checkboxTpl', width: 125, unresize: true }
							, { fixed: 'right', title: '操作', width: 135, minWidth: 125, toolbar: '#barDemo' }
						]]
						, data: [{
							"c_id": "1"
							, "c_name": "零食"
							, "c_leicing": "食品"
							, "c_jiage": "112"
							, "c_shangpintu": ""
							, "c_jianjie": "好吃"
							, "c_repertory": "1234"
							, "u_name": "234567"
							, "c_sales_volume": "120"
						}, {
							"c_id": "2"
							, "c_name": "零食1"
							, "c_leicing": "食品"
							, "c_jiage": "102"
							, "c_shangpintu": ""
							, "c_jianjie": "好吃!!"
							, "c_repertory": "1034"
							, "u_name": "234347"
							, "c_sales_volume": "110"
						}
							, {
							"c_id": "3"
							, "c_name": "零食3"
							, "c_leicing": "食品"
							, "c_jiage": "1022"
							, "c_shangpintu": ""
							, "c_jianjie": "好吃!!!"
							, "c_repertory": "1034"
							, "u_name": "234347"
							, "c_sales_volume": "110"
						}]
					})

					$("#search").click(function () {
						let shop_name = $("#shop_name").val();
						if (shop_name != "") {
							tableIns.reload({
								where: {
									shop_name: shop_name,
								}, page: {
									curr: 1 //重新从第 1 页开始
								}
							})
						}
					})

					table.on('toolbar(test)', function (obj) {
						if (obj.event === 'add') {  // 监听添加操作
							var index = layer.open({
								title: '添加商品',
								type: 2,
								shade: 0.2,
								maxmin: true,
								shadeClose: true,
								area: ['100%', '100%'],
								content: '../shangpin_add.html',
								end: function () {
									location.reload();
								}
							});
							$(window).on("resize", function () {
								layer.full(index);
							});
						}
					});


					table.on('tool(test)', function (obj) {
						var data = obj.data;
						if (obj.event === 'delete') {
							layer.confirm('真的删除行么', function (index) {
								obj.del();
								layer.close(index);
							});
						}
					});


					//监听状态操作 点击时触发
					form.on('switch(sexDemo)', function (data) {
						alert(111)
						// if (this.checked == true) {

						// }else if(this.checked == false){

						// }
						layer.msg('商品状态' + (this.checked ? '审核未通过' : '审核通过'), {
							offset: '6px'
						});

					});
				});


		//日期范围

			</script>
		</body>

		</html>